/**
author: sailing
date: 2016/11/21
****/
<style lang='less'>
.leftPanel {
  width:180px;
  height: 100%;
  border-right:1px solid #ccc;
  transition:left 1s ease 0s;
  position:absolute;
  left:0px;
  .liList{
    padding-top:25px;
    padding-left:10px;
  }
  .liHeight{
    height:40px;
    line-height:40px;

    .textLine{
      display:inline-block;
      position:absolute;
      color:#70c3ea;
      left:45px;
    }
  }
  .imgs{
    height:30px;
    width:30px;
  }	
}
</style>

<template>
  <div class='leftPanel' v-bind:style="{left: left + 'px'}">
    <ul class='liList'>
      <li>
        <span class='textLine'>业务名称:</span>
      </li>
      <li class='liHeight'>
        <span class='textLine'>{{bName}}</span>
      </li>
      <li class='liHeight' v-for='el in listText'>
        <img class='imgs' v-bind:src='el.src'/> <span class='textLine'>{{el.text}}<span style='color:red'>{{el.number}}</span>台</span>
      </li>
    </ul>
    <leftTool></leftTool>
  </div>
</template>
<script>
import eventBus from '../eventBus'
import tools from '../server/tools'
import leftTool from './leftTool'
export default {
  data () {
    return {
      bName: '',
      left: 0,
      listText: [{
        src: '../static/assets/icon/server.png',
        text: '关联服务器',
        type: 'server',
        number: 0
      }, {
        src: '../static/assets/icon/storage.png',
        text: '关联存储设备',
        type: 'storage',
        number: 0
      }, {
        src: '../static/assets/icon/router.png',
        text: '关联网络设备',
        type: 'router',
        number: 0
      }, {
        src: '../static/assets/icon/safety.png',
        text: '关联安全设备',
        type: 'safety',
        number: 0
      }]
    }
  },
  components: {
    leftTool
  },
  methods: {
    clickBnt () {
    }
  },
  mounted () {
    this.bName = tools.getCookie('bizx')
    var that = this
    eventBus.bus.$on('sendCounter', function (param) {
      for (var i = 0; i < that.listText.length; i++) {
        that.listText[i]['number'] = param[that.listText[i]['type']]
      } 
    })
    eventBus.bus.$on('leftClose', function (data) {
      if (data.flag) {
        that.left = 0
      } else {
        that.left = -180
      }
    })
  }
}
</script>
